import axios from 'axios'
import { Message } from 'element-ui'
import store from '@/store'
const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API,
  timeout: 5000
})

service.interceptors.request.use(
  config => {
    const token = store.getters.token
    if (token) {
      config.headers['Authorization'] = `Bearer ${token}`
      // 后台解析的方法要求必须前面拼接一个Bearer 和一个空格
    }
    return config
  },
  error => {
    return Promise.reject(error)
  }
)

service.interceptors.response.use(
  response => {
    // console.log(response);
    // 因为后台成功/失败都是200,如何区分成功和失败,用success字段
    // response参数,axios响应对象(里面config/header/status/data字段)
    // data字段里对应的才是后台返回的全部数据(也是一个对象)
    // 第一个data:是axios自带的
    const { success, message } = response.data
    if (success) {
      return response.data // 返回给逻辑页面的直接是后台的完整数据对象,
      // 不再是axios封装response对象(防止逻辑页面.两次data)
    } else {
      // 逻辑失败(把后台返回message提示文字返回到逻辑页面)
      // 返回promise的reject拒绝状态(await无法接收,如果有try+catch进catch里)
      Message.error(message)
      return Promise.reject(message)
    }
  },
  error => {
    // 4xx的响应状态,如果后台返回了响应数据,我们就用他,如果没有,就error对象本身message值
    // &&(逻辑与)是为了防止null.data报错||(逻辑或)
    Message.error(
      (error.response && error.response.data && error.response.data.message) ||
        error.message
    )
    return Promise.reject(error)
  }
)

export default service
